<template>
	<view class="form-container">
			<view class="form-group">
				<label for="企业名称">企业名称</label>
				<input type="text" v-model="form.enterName" placeholder="请输入" class="input-field" required />
			</view>
			<view class="form-group">
				<label for="统一社会信用代码">统一社会信用代码</label>
				<input type="tel" v-model="form.enterNumber" placeholder="请输入" class="input-field" required />
			</view>
			<view class="form-group">
				<label for="企业地址">企业地址</label>
				<input type="text" v-model="form.enterAddress" placeholder="请输入" class="input-field" required />
			</view>
			<view class="form-group">
				<label for="法人">法人</label>
				<input type="text" v-model="form.juridicalPerson" placeholder="请输入" class="input-field" required />
			</view>
			<view class="form-group">
				<label for="法人电话">法人电话</label>
				<input type="tel" v-model="form.jpPhone" placeholder="请输入" class="input-field" required />
			</view>
			<view class="form-group">
				<label for="法人身份证号">法人身份证号</label>
				<input type="tel" v-model="form.jpCard" placeholder="请输入" class="input-field" required />
			</view>
			<button type="primary"  class="submit-button" @tap="submit">提交</button>
	</view>
</template>

<script setup lang="ts">
	import { reactive, ref } from 'vue';
	import { insertEnterpriseInfo} from '../../services/company';

	const form = reactive({
		enterName: '',
		juridicalPerson: '',
		enterAddress:'',
		enterNumber:'',
		jpPhone: '',
		jpCard:''

	});

	const submit =async () => {
		if (form.enterName==''||form.juridicalPerson===''||form.enterAddress===''|| form.enterNumber===''|| form.jpPhone===''|| form.enterNumber===''|| form.jpCard==='' ) {
			uni.showToast({
				title: '请填写完整信息',
				icon: 'none'
			})
			return;
		}else{
			
			const res = await insertEnterpriseInfo(form)
			console.log(res)
			uni.showToast({
				title: '提交成功',
				icon: 'success'
			})
		}
	};


</script>

<style scoped>
.form-container {
  padding:0 20px;
  background-color: #f9f9f9;
  border-radius: 8px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.form-group {
  margin-bottom: 16px;
}

label {
  display: block;
  font-weight: bold;
  margin-bottom: 8px;
  color: #333;
}

.input-field {
  width: 100%;
  padding: 0 10px;
  border: 1px solid #ddd;
  border-radius: 4px;
  box-sizing: border-box;
}

.input-field:focus {
  border-color: #007bff;
  outline: none;
}

.submit-button {
  background-color: #007bff;
  color: #fff;
  border: none;
  border-radius: 4px;
  font-size: 16px;
  cursor: pointer;
}

.submit-button:hover {
  background-color: #0056b3;
}
</style>